<!DOCTYPE html>
<html>
<head>
    <title></title>

    <style>
        html, body, #wrapper {
            height: 100%;
        }

        body > #wrap {
            height: auto;
            min-height: 100%;
        }

        #main {
            padding-bottom: 150px;
        }

        .left-sidebar {
            width: 220px;
            float: left;
        }

        .center-sidebar {
            overflow: hidden;
        }

        .right-sidebar {
            width: 180px;
            float: right;
        }

        #footer {
            position: relative;
            margin-top: -150px; /* отрицательное значение высоты футера */
            height: 150px;
            clear: both;
        }

        .clearfix:after {
            content: ".";
            display: block;
            height: 0;
            clear: both;
            visibility: hidden;
        }
    </style>
</head>
<body>
<div id="wrapper">

    <div id="header">
        Header
    </div>

    <div id="main" class="clearfix">

        <div class="left-sidebar">Left sidebar</div>
        <div class="right-sidebar">Right sidebar</div>
        <div class="center-sidebar">Center</div>

    </div>

</div>

<div id="footer">
    Footer
</div>
</body>
</html>